<template>
  <div class="menu">
    <div class="person">
    <div class="btnM">订单提交</div>
    <div style="clear:both;"></div>
    <h1>订单提交</h1>
    <mt-field :attr="{ minlength: 3}" label="姓名" placeholder="请输入姓名" v-model="name"></mt-field>
    <mt-field :attr="{ minlength: 11}" label="手机号" placeholder="请输入手机号" v-model="phone"></mt-field>
    <mt-field label="收货地址" placeholder="请输入收货地址" v-model="address"></mt-field>
    <mt-field label="备注信息" v-model="desc" type="textarea"></mt-field>
    <!-- <router-link :to="{ name: 'Person'}" class="haha">没有账号，我要注册</router-link> -->
    <mt-button @click="menuClick()" size="large" type="primary" class="btnC">订单提交</mt-button>
  </div>
  </div>
</template>
<script>
import { menu,getAllGoods } from '../services/product_type';
import cookie from 'js-cookie';

export default {
  name: 'menu',
  data() {
    return {
      name: '',
      phone: '',
      address: '',
      desc: '',
      allGoodsCount: '',
      allGoodsPrice: '',
      list: [],
    };
  },
  methods: {
    menuClick() {
      const aa = new Date();
      console.log(aa);
      menu({
        userName: cookie.get('userName'),
        name: this.name,
        phone: this.phone,
        address: this.address,
        desc: this.desc,
        allGoodsCount: this.allGoodsCount,
        allGoodsPrice: this.allGoodsPrice,
        goodsDetail: this.list,
        listName: aa,
      })
        .then( res => {
          console.log(res);
          this.$router.push({ name: 'HelloWorld'})
        })
        .catch( err => {
          console.log(err);
        })
    },
  },
  created() {
    getAllGoods({
      userName: cookie.get('userName'),
    })
      .then( res => {
        console.log(res);
        this.allGoodsCount = res.data.all,
        this.allGoodsPrice = res.data.allP,
        this.list = res.data.info
      })
      .catch( err => {
        console.log(err);
      })
  }
}
</script>
<style scoped>
.person{
  text-align: center;
}
.haha{
  float: right;
  text-decoration: none;
  font-size: 0.6rem;
}
.btnC{
  margin-top: 5rem;
}
.btnM{
  float: left;
  width: 3rem;
  font-size: 0.6rem;
  background-color: rgb(244, 244, 244);
}
</style>

